<template>
	<view>
		<view class="bk-white pd-md">
			<view class="lay-c-c mg-b-md">
				<view class="flex1 pd-md bk-white-gray radius3 lay-c-c" style="height: 60rpx;">
					<input class="flex1" placeholder="请输入姓名查询" v-model="filterKeyword"/>
				</view>
				<button class="btn mg-l-md" @click="onFilter">搜索</button>
			</view>
			
			<view class="pd-md bk-white-gray">
				<view class="lay-sb-c-c">
					<view class="">签到人数：{{signInCount + '/' + signUpCount}}</view>
					<!-- <button v-if="signInStatus==1" class="btn bk-orange white" @click="closeSignIn">关闭签到通道</button>
					<button v-else class="btn bk-orange white" @click="openSignIn">开启签到通道</button> -->
				</view>
				
				<view class="mg-t-lg lay-sa-c-c">
					<button :class="filterType==1?'btn bk-blue white radius3':'btn bk-white dark-grey radius3'" style="border: 1rpx solid #808080;" @click="changeFilterType(1)">已签到({{signInCount}})</button>
					<button :class="filterType==0?'btn bk-blue white radius3':'btn bk-white dark-grey radius3'" style="border: 1rpx solid #808080;" @click="changeFilterType(0)">未签到({{signUpCount-signInCount}})</button>
				</view>
			</view>
		</view>
		
		<view class="mg-t-md pd-md">
			<view class="red">温馨提示</view>
			<view class="grey">1、现场签到功能用于确认已到达比赛场的参赛选手人数</view>
			<view class="grey">2、发布者可以根据赛事需求决定是否使用在线签到功能，未签到的也可以参与钓位抽签</view>
		</view>
		
    <view class="vspace-lg"></view>

    <view class="mg-b-md pd-md" v-for="(player, index) in signInPlayers" :key="index">
      <view>
		<label> <checkbox :checked="player.checked" />{{player.userNickname+"("+player.userId+")"}} </label>
      </view>
      <view>
        <text>手机号：</text><text>{{player.userPhone}}</text>
      </view>
      <view>
        <text>签到状态：</text><text>{{player.signInState==1?"已签到":"未签到"}}</text>
      </view>
    </view>

	</view>
</template>

<script>
	import {
		MyTip
	} from '@/components/ssty/common.js';
	import {
		getSignPlayers,
		changeRaceSignStatus,
		auditRacePlayers,
		
	} from '@/api/fsh.js';
	const app = getApp();
	
	export default {
		data() {
			return {
				filterKeyword: '',
				filterType: 0,
				
				signInStatus: 0,
				
				raceId: '',
				signInPlayers:[],

				signUpCount: 0, // 报名人数
				signInCount: 0, // 签到人数
			}
		},
		onLoad(options) {
			this.raceId = options.raceId;
			
			if(!app.globalData.tempParam_for_raceManage || app.globalData.tempParam_for_raceManage.raceId != this.raceId) {
				MyTip("跨页面传参失败");
				uni.navigateBack();
				return;
			}
			
			getSignPlayers(this.raceId, 1).then(res=>{
				this.onLoadSignPlayers(res);
			}).catch(err=>{
				console.log("getSignPlayers fail, err=%o", err)
				MyTip(err.msg);
			})
		},
		methods: {
			onLoadSignPlayers(res) {
				this.signInStatus = res.entity.signInStatus;
				this.signInPlayers = res.entity.signUpPlayers.map(a=>{
					a.checked=false;
					return a;
				});
				this.signUpCount = this.signInPlayers.length;
				
				this.signInPlayers.forEach(a=>{
					switch(a.signInState) {
						case 1: ++this.signInCount; break;
					}
				})
				
				this.original_signInPlayers = JSON.parse(JSON.stringify(this.signInPlayers));
				
				this.changeFilterType(this.signInStatus);
			},
			
			onFilter() {
				if(this.filterKeyword) {
					this.signInPlayers = this.signInPlayers.filter(a=>a.userNickname.indexOf(this.filterKeyword) >= 0);
				}
				else 
					this.signInPlayers = JSON.parse(JSON.stringify(this.original_signInPlayers));
			},
			
			openSignIn() {
				changeRaceSignStatus(this.raceId, 1, 0, 1).then(res=>{
					this.signInStatus = 1;
				}).catch(err=>{
					console.log("changeRaceSignStatus fail, err=%o", err)
				})
			},
			
			closeSignIn() {
				changeRaceSignStatus(this.raceId, 1, 1, 0).then(res=>{
					this.signInStatus = 0;
				}).catch(err=>{
					console.log("changeRaceSignStatus fail, err=%o", err)
				})
			},
			
			changeFilterType(type) {
				this.filterType = type;
				this.signInPlayers = JSON.parse(JSON.stringify(this.original_signInPlayers));
				this.signInPlayers = this.signInPlayers.filter(a=>a.signInState==type);
				if(this.filterKeyword) {
					this.signInPlayers = this.signInPlayers.filter(a=>a.userNickname.indexOf(this.filterKeyword) >= 0);
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "@/leui.scss";
	
	page {
		height: 100%;
	}
	
	.margin {
		margin-top: 20px;
	}
</style>
